<template>
  <div id="box">
      <div class="topbar">
            <div class="iconfont" @click="fun()">
              <van-icon name="arrow-left"/>
            </div>
            <p>我的订单</p>
      </div>

     
        <div class="banner">
            <router-link to="/myordersona">全部</router-link>
            <router-link to="/myordersonb">立等可取</router-link>
            <router-link to="/myordersonc">预约订单</router-link>
        </div>
        <router-view></router-view>
  </div>
</template>

<script>

export default {
    
    methods: {
        fun(){
            this.$router.push("/my")
        }
    }
}
</script>

<style scoped>

#box{
    padding:0 0.12rem;
    box-sizing: border-box;
    background:#f5f5f5;
}
.topbar{
    width:2.2rem;
    height: 0.5rem;
    align-items: center;
    display: flex;
    justify-content: space-between;

}
.topbar p{
    font-size:0.2rem ;
}
.topbar .iconfont{
    font-size:0.3rem;
}

.banner{
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #6d87c4;
    border-radius:0.2rem ;
}
a{
    color: #fff;
    width: 115px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    border-radius: 20px;
}
.router-link-active{
    background: #fff;
    color: #6d87c4;

}

</style>